<template>
	<!-- 咨询列表 -->
	<view class="page">
		<c-scroll-list ref="list" :option="{auto:false}" :api="api" @load="load">
			<view class="t_list" v-for="(v,i) in courseList" :key="i" @click="goInfoDetails(v)">
				<view class="t_list_l">
					<view class="t_name">{{v.title}}</view>
					<!-- <view class="look_num">
						<u-icon name="eye" color="#999999" size="32rpx"></u-icon>
						{{v.viewNum>10000?(v.viewNum/10000).toFixed(1)+'w':v.viewNum}}
					</view> -->
				</view>
				<image class="t_img" :src="vuex_imgUrl+v.mainImg" mode=""></image>
			</view>
		</c-scroll-list>
	</view>
</template>

<script>
	export default {
		name: "infoList",
		data() {
			return {
				api: this.$api.getInfoList,
				courseList: []
			};
		},
		onLoad() {},
		onShow() {
			this.$refs.list.initList()
		},
		methods: {
			//小程序资讯列表
			load(res) {
				console.log(res, '小程序资讯列表');
				this.courseList = res.list
			},

			// 去咨询详情
			goInfoDetails(v) {
				uni.setStorageSync('infoDetail', v)
				this.$fn.jumpPage('/pages/home/pages/infoDetails')
			}
		}
	};
</script>

<style lang="scss" scoped>
	.page {
		padding: 40rpx 32rpx;
		box-sizing: border-box;

		.t_list {
			padding: 28rpx 0;
			border-bottom: 1rpx solid #E6E6E6;
			display: flex;
			align-items: center;
			gap: 34rpx;

			.t_list_l {
				flex: 1;
				height: 132rpx;
				display: flex;
				flex-direction: column;
				justify-content: space-between;

				.t_name {
					width: 100%;
					font-weight: 500;
					font-size: 28rpx;
					color: #333333;
					display: -webkit-box;
					-webkit-box-orient: vertical;
					-webkit-line-clamp: 3;
					overflow: hidden;
					text-overflow: ellipsis;
				}

				.look_num {
					display: flex;
					align-items: center;
					gap: 10rpx;
					font-weight: 400;
					font-size: 24rpx;
					color: #999999;
				}
			}

			.t_img {
				flex: none;
				width: 176rpx;
				height: 132rpx;
				border-radius: 4rpx;
			}

		}
	}
</style>